<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<!-- 引入react核心库js文件 -->
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<!-- 引入react-dom，用于支持react操作DOM -->
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>

<body>
    <div id="root"></div>

    <script type="text/javascript">
        // 1.创建虚拟DOM

        // const VDOM = document.createElement(标签名,标签属性,标签内容)
        
    //    js方法注意前缀换成React
        // const VDOM = React.createElement('h1',{id:'title'},'Hello-React')


        // 添加span属性
        const VDOM = React.createElement('h1',{id:'title'},React.createElement('span',{},'my is span'))
        // 2.渲染虚拟DOM到页面

        ReactDOM.render(VDOM, document.getElementById('root'))


        function fn(a) { }
        console.log(a);
        var a = 123;
        console.log(a);
        fn(5)
    </script>
</body>

</html>